media query 4(media query) 는 웹 페이지의 내용이 모니터, 스마트폰 또는 태블릿과 같은 화면에서 페이지가 화면에 맞게 조정될 수 있도록 min-width, max-width 를 사용하여 화면 가로 사이즈에 따라 조정될 수 있도록 설정합니다. ex) min-width: 800px;, max-width: 800px; 코드 결과 화면 가로 사이즈가 800px 이하일 경우 display: none으로 설정했기 때문에 화면에 ... CSSmedia queryCSS instagram 로그인 클론 깜박 하고 블로그 작성용 잘못 만든 코드를 저장해놓지 못했다. 박스 자체가 단순해서 금방 끝날 줄 알았으나 삽질의 시작이었다. 이 속성의 특징은 부모의 좌표를 기준으로 자식의 좌표를 움직일 수 있다. 그래서 나는 박스 세로 정렬을 부모를 기준으로 해서 정렬하려 했다. 그랬더니 나타나는 현상이 모든 박스들이 모여서 합쳐져 버린 것 이다. 이는 이 속성의 가장 큰 특징으로 모든 태그들을 붕 띄어... media queryblockinline blockFlexFlex CSS 미디어 쿼리 (반응형 페이지) 추가로 컴퓨터가 아닌 iOS, Android 스마트폰에서 접속했을 때 보기 좋은 반응형 페이지를 작성하게 되면 뿌듯함이 더해졌다. 그러던 중 미디어 쿼리에 대해 접할 수 있었고, 이 기능을 사용하면 vw, vh 속성만을 사용하는 것보다 훨씬 깔끔하게 반응형 페이지를 만들 수 있을 것 같았다. 미디어 쿼리 사용법 그 다음, 미디어 쿼리 데스크탑을 우선할 경우 아래와 같이 미디어 쿼리에 max-... CSSReactmedia queryCSS SCSS 미디어쿼리(Media Query) SCSS를 이용해서 간편하게 미디어 쿼리를 적용하는 방법을 알아보자 먼저, SCSS는 Sass의 상위호환으로 CSS와 호환될 수 있는 문법을 갖고 있다. CSS와 문법이 좀 다른 Sass에 비해 SCSS는 거의 완벽히 CSS 문법과 호환이 되어 편리하다. SCSS를 기반으로 살펴보자! 변수를 사용할 수 있다. 변수 사용법 믹스인은 CSS를 묶어서 재사용할 수 있는 모듈로 만들어 준다. 이렇게... scssmedia query미디어쿼리media query
4(media query) 는 웹 페이지의 내용이 모니터, 스마트폰 또는 태블릿과 같은 화면에서 페이지가 화면에 맞게 조정될 수 있도록 min-width, max-width 를 사용하여 화면 가로 사이즈에 따라 조정될 수 있도록 설정합니다. ex) min-width: 800px;, max-width: 800px; 코드 결과 화면 가로 사이즈가 800px 이하일 경우 display: none으로 설정했기 때문에 화면에 ... CSSmedia queryCSS instagram 로그인 클론 깜박 하고 블로그 작성용 잘못 만든 코드를 저장해놓지 못했다. 박스 자체가 단순해서 금방 끝날 줄 알았으나 삽질의 시작이었다. 이 속성의 특징은 부모의 좌표를 기준으로 자식의 좌표를 움직일 수 있다. 그래서 나는 박스 세로 정렬을 부모를 기준으로 해서 정렬하려 했다. 그랬더니 나타나는 현상이 모든 박스들이 모여서 합쳐져 버린 것 이다. 이는 이 속성의 가장 큰 특징으로 모든 태그들을 붕 띄어... media queryblockinline blockFlexFlex CSS 미디어 쿼리 (반응형 페이지) 추가로 컴퓨터가 아닌 iOS, Android 스마트폰에서 접속했을 때 보기 좋은 반응형 페이지를 작성하게 되면 뿌듯함이 더해졌다. 그러던 중 미디어 쿼리에 대해 접할 수 있었고, 이 기능을 사용하면 vw, vh 속성만을 사용하는 것보다 훨씬 깔끔하게 반응형 페이지를 만들 수 있을 것 같았다. 미디어 쿼리 사용법 그 다음, 미디어 쿼리 데스크탑을 우선할 경우 아래와 같이 미디어 쿼리에 max-... CSSReactmedia queryCSS SCSS 미디어쿼리(Media Query) SCSS를 이용해서 간편하게 미디어 쿼리를 적용하는 방법을 알아보자 먼저, SCSS는 Sass의 상위호환으로 CSS와 호환될 수 있는 문법을 갖고 있다. CSS와 문법이 좀 다른 Sass에 비해 SCSS는 거의 완벽히 CSS 문법과 호환이 되어 편리하다. SCSS를 기반으로 살펴보자! 변수를 사용할 수 있다. 변수 사용법 믹스인은 CSS를 묶어서 재사용할 수 있는 모듈로 만들어 준다. 이렇게... scssmedia query미디어쿼리media query